@extends('admin.layouts.master')
@section('css')
    <style>
        /*master引入后显示==会员管理*/
        .shop_manage{
            background: #393F64;
        }
        /*搜索框所在的区域*/
        .main_header{
            float: left;
            margin-top: 8px;
            width:100%;
            height: 100px;
            line-height: 100px;

        }
        .main_header_search{
            float: left;
            width: 155px;
            position: relative;
        }
        .main_header_search input{
            border-radius:6px;
            width: 215px;
            height: 40px;
            margin-top: 30px;
            border: 0px solid;
        }
        .main_header_search input:hover{
            box-shadow: 0 8px 12px rgba(0,0,0,0.2);
        }
        .icon_fdj{
            z-index: 10;
            top: 40px;
            left:5px;
            position: absolute;
            background: url("{{asset('images/search_icon.png')}}") no-repeat 0 0;
            width: 26px;
            height: 26px;
        }
        .main_header_search input{
            padding-left:45px;
            font-size: 16px;
            color:#ccc;
        }
        /*================*/
        .main_header_add{
            float: right;
            width: 215px;
            height: 100px;
            line-height: 100px;
            text-align: right;

        }
        .add_box {
            float: right;
            width: 90px;
            height: 40px;
            margin-top: 32px;
            background: #fff;
            line-height: 40px;
            cursor: pointer;
            border-radius: 6px;
            margin-left:17px;
        }
        .add_box:hover{
            box-shadow: 0 8px 12px rgba(0,0,0,0.2);
        }

        .add_box img{
            float:left;
            margin-top:6px;
            margin-left:6px;
            width: 28px;
            height: 28px;
            line-height: 40px;
        }
        .add_box span{
            float: left;
            font-size:18px;
            margin-left: 8px;
            color:  #24a7f6;
        }
        /*======主要内容区=====*/
        .main_form{
            float: left;
            width: 100%;
            height: 783px;
            background: #fff;
            border-radius: 10px;
            box-shadow: 0 8px 12px rgba(0,0,0,0.2);
        }
        .main_formlist{
            margin-top:30px;
        }
        .main_table{
            width: 94%;
            margin: 0 auto;
            border: 1px solid #B1B1B1;
        }
        .main_table tr{
            height: 15px;
            width: 100%;
        }
        .main_table tr th{
            text-align: center;
            line-height: 20px;
            height: 20px;
            font-size: 18px;
        }
        .main_table tr td{
            text-align: center;
        }
        /*======操作中的编辑与删除的样式======*/
        .formlist_handle a{
            font-size:18px;
            text-decoration: none;
        }
        .formlist_handle span{
            font-size:18px;
            cursor: pointer;
        }
        .formlist_edit{
            color: #79C9F7;
        }
        .formlist_destory{
            color: red;
        }

        /*=====下面的是分页=========*/
        /*.fenye{
            margin: 0 auto;
            margin-top:25px;
            width: 94%;
            height: 55px;

        }
        .choose{
            float:right;
        }
        .choose_total{
            float: left;
            border: 0px solid;
            margin-left: 5px;
            background: #fff;
            color: #979797;
            padding: 0px 10px;
            height: 34px;
            line-height: 34px;
            font-size: 15px;
        }
        .choose_num {
            float: left;
            border: 1px solid #979797;
            margin-left: 5px;
        }
        .choose_num input{
            width: 40px;
            text-align: center;
            height: 32px;
            line-height: 30px;
        }
        .choose_btn{
            float: left;
            border-radius: 0px;
            background: #fff;
            border: 1px solid #979797;
            color: #979797;
            margin-left: 5px;
        }
        .btn-primary:hover{
            background:#fff;
            border: 1px solid #ccc;
            color: #ccc;
        }*/
        /*===定制分页页面  end====*/
        /*laravel自带的分页样式*/
        .boot_fenye{
            margin: 0 auto;
            margin-top:10px;
            width: 94%;
            height: 55px;
        }
        .boot_choose{
            float:right;
        }

    </style>
@endsection
@section('content')

    <div class="main_header clearfix">

        {{--<div class="main_header_search clearfix">--}}
            {{--<i class="icon_fdj" style="left: 105%;top:36px;"></i>--}}
            {{--<input type="text" placeholder="输入店铺名称" name="username" class="shop_name" value="" style="padding-left: 10px;width: auto;">--}}
        {{--</div>--}}
        <div class="input-group input_style"  style="width:200px;float: left;margin-top: 33px;">
            <input type="text" class="form-control shop_name_in" placeholder="输入店铺名称" name="username" style="height: 40px;"/>
            <span class="input-group-btn btnsubmit">
               <button class="btn btn-info btn-search glyphicon glyphicon-search" style="background: #3FB2F7;height: 40px; "></button>
            </span>
        </div>

        <div class="main_header_add clearfix" style="width: auto;">
            <div class="add_box" data-toggle="modal" data-target="#myModal">
                <img src="{{asset('images/add_icon.png')}}" alt="">
                <span>新增</span>
            </div>
            <div class="add_box">
                <form action="" method="post" enctype='multipart/form-data' id="formlist">
                    <input type="file" name="excel" style="position: absolute;width: 90px;height: 40px;opacity: 0;-ms-filter: 'alpha(opacity=0)';"  onchange="fileupload()" value=""  multiple="multiple" id="file">
                    <img src="{{asset('images/lodingin_icon.png')}}" alt="">
                    <span style="color:orange">导入</span>
                </form>
            </div>
            <div class="add_box">
                <form action="" method="post" enctype="multipart/form-data" style="margin-top: -30px;">
                    <div class="add_box add_model">
                        <span  onclick="downloadExcel()">模板下载</span>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <div  class="main_form clearfix">
        <!-- 表格 -->
        <div class="main_formlist">
            <table class="table table-bordered main_table">
                <tbody>
                    <tr>
                        <th>店铺名称</th>
                        <th>地址</th>
                        <th>开放时间</th>
                        <th>状态</th>
                        <th>操作</th>
                    </tr>
                    @foreach($shoplist as $shop)
                    <tr>
                            <td>{{$shop->shop_name}}</td>
                            <td>{{$shop->shop_info}}</td>
                            <td>{{$shop->created_at}}</td>
                            <td>@if($shop->status==0)
                                未营业
                            @elseif($shop->status==1)
                                营业中
                            @endif</td>
                            <td>
                                <span class="formlist_handle">
                                    <a href="{{url('/admin/shop/show',['goods_id'=>$shop->id])}}" class="formlist_edit">查看</a>
                                    <span class="formlist_destory change"  href="{{url('/admin/shop/destroy',['goods_id'=>$shop->id])}}"
                                          onclick="if(confirm('确定删除吗?')==false) return false;">删除</span>
                                </span>
                            </td>
                    </tr>
                    @endforeach
                </tbody>

            </table>
        </div>
        <div class="boot_fenye">
            <div class="boot_choose">
                {{$shoplist->links()}}
            </div>
        </div>
    </div>
@endsection
<!-- Modal -->
<div style="display: none;margin-top: 100px;" class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content" style="width: 350px;margin-left: 180px;">
            <div class="modal-header" style="background: #3D446B;">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="color: white;"><span aria-hidden="true"><img
                                src="{{asset('/images/cancel_icon.png')}}" alt=""></span></button>
                <h4 class="modal-title" id="myModalLabel" style="color: white;text-align: center; font-size: 24px;">新增</h4>
            </div>
            {{--<form action="{{url('/admin/shop/index')}}" method="post" enctype='multipart/form-data' name="upload_form" >--}}
                {{--{{csrf_field()}}--}}
                <div class="modal-body">
                    <div class="modal_info clearfix">
                        <p class="blinfo"><span>店铺名称</span><br>
                            <input type="text" name="shop_name" class="shop_name" value="">
                        </p>
                        <p class="blinfo"><span>店铺编号</span><br>
                            <input type="text" name="shop_id" class="shop_id" value="{{$next_id}}" readonly="readonly">
                        </p>
                        <p class="blinfo"><span>店铺地址</span><br>
                            <input type="text" name="shop_info" class="shop_info" value="">
                        </p>
                        <p class="blinfo"><span>店铺密钥</span><br>
                            <input type="text" name="shop_secret" class="shop_secret" value="{{$shop_key}}" readonly="readonly">
                        </p>
                        <p class="blinfo"><span>开业日期</span><br>
                            <input type="text" name="shop_date" class="shop_date" value="">
                        </p>
                    </div>
                </div>
            <div id="allmap" style="height:30%;display: none;"></div>
       <div class="modal-footer" style="text-align: center;">
           <input type="submit" value="提交" class="btn btn-primary" style="height:40px;border: 0px solid;width: 300px;background: #2BAAF7" />
       </div>
   {{--</form>--}}
        </div>
    </div>
</div>

@section('js')

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=3W1MFos8Akm82Ku0EDYLrhlXfWYOplWh"></script>
<script type="text/javascript">
$(".btnsubmit").click(function (){
    secher();
});
$('.shop_name_in').focus(function (){
    $("input").keydown(function(){
        if (event.keyCode == "13") {//keyCode=13是回车键
            secher();
        }
    });
});
$('.shop_info').blur(function (){
    var shop_info   = $('.shop_info').val();
    if(shop_info && shop_info.length > 2){
        $('#allmap').css('display','block');
        var map = new BMap.Map("allmap",{minZoom:11,maxZoom:18});  // 创建Map实例
        map.centerAndZoom('上海', 11);
        map.enableScrollWheelZoom();   //启用滚轮放大缩小，默认禁用
        map.enableContinuousZoom();    //启用地图惯性拖拽，默认禁用
        map.addEventListener("click",function(e){
            var marker = new BMap.Marker(new BMap.Point(e.point.lng, e.point.lat));  // 创建标注
            map.addOverlay(marker);               // 将标注添加到地图中
            var html = "<input type='hidden' name='point' class='point' lng="+e.point.lng+" lat="+e.point.lat+">";
            $(".blinfo").append(html);
        });
    }
});
function secher(){
    var shop_name = $('.shop_name_in').val();
    if(shop_name == ''){
        alert('商店名称不能为空');
        return false;
    }else{
        var url = '/admin/shop/index/'+ shop_name;
        window.location.href = url;
    }
}
$(".btn-primary").click(function (){
    var shop_name   = $('.shop_name').val();
    var shop_info   = $('.shop_info').val();
    var shop_id     = $('.shop_id').val();
    var shop_secret = $('.shop_secret').val();
    var shop_date   = $('.shop_date').val();
    var point       = $('.point').attr('lng')+','+$('.point').lat('lng');
    $.ajax({
        type : 'post',
        dataType:'json',
        data : {"shop_name": shop_name,"shop_info": shop_info,"shop_id":shop_id,"shop_secret":shop_secret,"shop_date":shop_date,"point":point,"shop_date":shop_date,'_token': "{{csrf_token()}}"},
        url  : '/admin/shop/index',
        success:function(msg){
            if(msg.code == 200){
                window.location.href = '/admin/shop/index';
                return false;
            }else{
                alert(msg.msg);
                return false;
            }
        }
    });
})

//店铺信息异步导入
function fileupload(){
    var file = $("#file").val();
    $('#formlist').ajaxSubmit({
        url:'/admin/shop/upload',
        dataType:'json',
        type:'post',
        data:{'file':file},
        success:function(res){
            if (res.status == 0) {
                alert(res.msg);
            } else {
                alert(res.msg);
            }
        }
    });
}
//模板下载
function downloadExcel(){
    //获取服务器地址
    var host = location.host;
    //把excel发送出来
    var url = "http://"+ host +"/admin/shop/download";
    window.open(url);
}
</script>
@endsection

